<template>
	<view class="uni-popup-dialog">
		<view class="uni-dialog-title">
			<image src="../../static/icon/close.png" class="close" @click="close"></image>
			<text class="uni-dialog-title-text" :class="['uni-popup__' + dialogType]">{{ title }}</text>
		</view>
		<view class="uni-dialog-content">
			<!-- 1=成果价值评估需求，2=寻求销售渠道合作，3=寻求转化生产合作，4=寻求法律维权服务 -->
			<view class=" paylist" @click="toPingjia(item.agreement)"  v-for="(item,index) in list" :key='index'>
				<view class="paystyle flex-row flex-between">
					<view class="labelLeft">
						<text v-if="item.type == 1">成果价值评估需求</text>
						<text v-if="item.type == 2">寻求销售渠道合作</text>
						<text v-if="item.type == 3">寻求转化生产合作</text>
						<text v-if="item.type == 4">寻求法律维权服务</text>
						<text v-if="item.status" :class="pjStatus==2?'active':'ing'">({{item.status==1?'申请中，待审核':'申请成功'}})</text>
					</view>
					<view class="labelRight">
						<image src="../../static/icon/right_arrow.png"></image>
					</view>
				</view>
			</view>
			<!-- <view class=" paylist" @click="toPingjia(6)">
				<view class="paystyle flex-row flex-between">
					<view class="labelLeft">
						<text>寻求销售渠道合作</text>
						<text v-if="tzStatus" :class="tzStatus==2?'active':'ing'">({{tzStatus==1?'申请中，待审核':'申请成功'}})</text>
					</view>
					<view class="labelRight">
						<image src="../../static/icon/right_arrow.png"></image>
					</view>
				</view>
			</view>
			<view class=" paylist" @click="toPingjia(7)">
				<view class="paystyle flex-row flex-between">
					<view class="labelLeft">
						<text>寻求转化生产合作</text>
						<text v-if="hzStatus" :class="hzStatus==2?'active':'ing'">({{hzStatus==1?'申请中，待审核':'申请成功'}})</text>
					</view>
					<view class="labelRight">
						<image src="../../static/icon/right_arrow.png"></image>
					</view>
				</view>
			</view>
			<view class=" paylist" @click="toPingjia(8)">
				<view class="paystyle flex-row flex-between">
					<view class="labelLeft">
						<text>寻求法律维权服务</text>
						<text v-if="yzStatus" :class="yzStatus==2?'active':'ing'">({{yzStatus==1?'申请中，待审核':'申请成功'}})</text>
					</view>
					<view class="labelRight">
						<image src="../../static/icon/right_arrow.png"></image>
					</view>
				</view>
			</view> -->
			<view class="paylist flex-row flex-between" style="padding: 50upx; 0"></view>
			
			
		</view>
		
	</view>
</template>

<script>
/**
 * PopUp 弹出层-对话框样式
 * @description 弹出层-对话框样式
 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
 * @property {String} value input 模式下的默认值
 * @property {String} placeholder input 模式下输入提示
 * @property {String} type = [success|warning|info|error] 主题样式
 *  @value success 成功
 * 	@value warning 提示
 * 	@value info 消息
 * 	@value error 错误
 * @property {String} mode = [base|input] 模式、
 * 	@value base 基础对话框
 * 	@value input 可输入对话框
 * @property {String} content 对话框内容
 * @property {Boolean} beforeClose 是否拦截取消事件
 * @event {Function} confirm 点击确认按钮触发
 * @event {Function} close 点击取消按钮触发
 */

export default {
	name: '',
	props: {
		value: {
			type: [String, Number],
			default: ''
		},
		num: {
			type: [String, Number],
			default: 0
		},
		placeholder: {
			type: [String, Number],
			default: '请输入内容'
		},
		/**
		 * 对话框主题 success/warning/info/error	  默认 success
		 */
		type: {
			type: String,
			default: 'error'
		},
		/**
		 * 对话框模式 base/input
		 */
		mode: {
			type: String,
			default: 'base'
		},
		/**
		 * 对话框标题
		 */
		title: {
			type: String,
			default: '发布需求申请'
		},
		/**
		 * 对话框内容
		 */
		content: {
			type: String,
			default: ''
		},
		/**
		 * 拦截取消事件 ，如果拦截取消事件，必须监听close事件，执行 done()
		 */
		beforeClose: {
			type: Boolean,
			default: false
		},
		/**
		 * detail
		 */
		info: {
			type: Object,
			default: {}
		},
		/**
		 * detail
		 */
		patentId: {
			type: [String,Number],
			default: {}
		}
	},
	data() {
		return {
			dialogType: 'info',
			focus: false,
			val: '',
			status:'',
			pjStatus:'',
			tzStatus:'',
			hzStatus:'',
			yzStatus:'',
			list:[]
		};
	},
	inject: ['popup'],
	watch: {
		type(val) {
			this.dialogType = val;
		},
		mode(val) {
			if (val === 'input') {
				this.dialogType = 'info';
			}
		},
		value(val) {
			this.val = val;
		}
	},
	created() {
		// 对话框遮罩不可点击
		this.popup.mkclick = false;
		if (this.mode === 'input') {
			this.dialogType = 'info';
			this.val = this.value;
		} else {
			// this.dialogType = this.type;
		}
	},
	mounted() {
		this.focus = true;
		this.getlist()
		let params = {
			patentId:this.patentId
		}
		this.$http.get('/', params).then(res => {
			if (res.code == '0') {
				console.log(res.data)
				this.status = res.data
				if(res.data.length>0){
					res.data.forEach(item=>{
						
						if(item.type == 1){
							console.log(1)
							this.pjStatus = item.status
							
						}
						if(item.type == 2){
							console.log(2)
							this.tzStatus = item.status
						}
						if(item.type == 3){
							console.log(3)
							this.hzStatus = item.status
						}
						if(item.type == 4){
							console.log(4)
							this.yzStatus = item.status
						}
						
					})
				}
				console.log(this.tzStatus)
			}
		});
		
		
	},
	methods: {
		getlist(){
			this.$http.get('/myPatent/getNeedApplyTypes',{patentId:this.patentId}).then(res => {
				if (res.code == '0') {
					console.log(res.data)
					this.list = res.data
					
				}
			});
		},
		/**
		 * 点击确认按钮
		 */
		onOk() {
			this.$emit(
				'confirm',
				() => {
					this.popup.close();
					if (this.mode === 'input') this.val = this.value;
				},
				this.mode === 'input' ? this.val : ''
			);
		},
		call(phone){
			uni.makePhoneCall({
			 	// 手机号
			    phoneNumber: phone, 
				// 成功回调
				success: (res) => {
					console.log('调用成功!')	
				},
				// 失败回调
				fail: (res) => {
					console.log('调用失败!')
				}
			  });
		},
		concatNow(){
			if (this.beforeClose) {
				this.$emit('close', () => {
					this.popup.close();
				});
				return;
			}
			this.popup.close();
		},
		/**
		 * 点击取消按钮
		 */
		close() {
			if (this.beforeClose) {
				this.$emit('close', () => {
					this.popup.close();
				});
				return;
			}
			this.popup.close();
		},
		checkAppio() {
			uni.navigateTo({
				url: '/pages/home/search'
			});
		},
		toPingjia(type){
			uni.navigateTo({
				url:`/pages/home/result?type=${type}&patentId=${this.patentId}&patentName=${this.info.patentName}`
			})
		}
	}
};
</script>

<style lang="scss" scoped>
.uni-popup-dialog {
	width: 100%;
	border-radius: 15px 15px 0 0;
	background-color: #fff;
	// padding: 0 0 40upx 0;
	// padding-bottom: 140upx;
}

.uni-dialog-title {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	justify-content: center;
	padding-top: 15px;
	padding-bottom: 5px;
	text-align: center;
	position: relative;
	image.close {
		position: absolute;
		width: 40upx;
		right: 20upx;
		top: 20upx;
		height: 40upx;
	}
}
.confirmBtn {
	position: fixed;
	left: 0;
	bottom: 0;
	background: #fff;
	width: 690upx;
	padding: 30upx;
	font-size: 30upx;
	color: #22222a;
	text {
		color: #fd580a;
		font-size: 48upx;
		font-weight: bold;
		&.dw {
			font-size: 28upx;
			padding-left: 16upx;
		}
	}
	.btns {
		width: 234upx;
		height: 80upx;
		line-height: 80upx;
		background: rgba(253, 88, 10, 1);
		border-radius: 8upx;
		color: #fff;
		font-size: 34upx;
		text-align: center;
	}
}
.uni-dialog-title-text {
	font-size: 32upx;
	font-weight: bold;
}

.uni-dialog-content {
	padding: 26upx 0upx 0;
	.tp{
		padding: 30upx;
		background:rgba(255,223,208,1);
		font-size: 24upx;
		color: #22222A;
		.names{
			color: #FD580A;
		}
		.nums{
			color: #38D214;
		}
		.uvip{
			color: #FD580A;
		}
		.tpText{
			line-height: 38upx;
		}
		.buyVip{
			// width:114upx;
			// height:40upx;
			padding: 5upx 10upx;
			background:rgba(253,88,10,1);
			border-radius:8upx;
			font-size: 22upx;
			color: #fff;
			// line-height: 40upx;
			// text-align: center;
		}
	}
	.paylist {
		border-bottom: 1upx solid rgba(238, 238, 238, 1);
		padding: 35upx 0;
		margin:0 35upx;
		// &:last-child{
		// 	border-bottom: none;
		// }
		.tishi{
			color: #999999;
			font-size: 30upx;
		}
		.concat{
			width:148upx;
			height:50upx;
			background:rgba(255,255,255,1);
			border:1upx solid rgba(204,204,204,1);
			border-radius:8upx;
			color: rgba(153,153,153,1);
			font-size: 28upx;
			line-height: 50upx;
			text-align: center;
		}
		.paystyle {
			width: 100%;
			display: flex;
			justify-content: space-between;
			align-items: center;
			.labelLeft {
				width: 90%;
				text-align: left;
				.active{
					color: #38D214;
				}
				.ing{
					color: #FD580A;
				}
			}
			.labelRight {
				flex: 1;
				display: flex;
				justify-content: flex-end;
				image{
					width: 14upx;
					height: 24upx;
				}
				.buyStyle {
					color: #22222A;
					font-size: 30upx;
				}
				.phone{
					width:148upx;
					height:50upx;
					background:rgba(255,255,255,1);
					border:1upx solid rgba(253,88,10,1);
					border-radius:8upx;
					color: rgba(253,88,10,1);
					font-size: 28upx;
					line-height: 50upx;
					text-align: center;
				}
			}
			display: flex;
			align-items: center;
			font-size: 30upx;
			color: #22222a;
			.imp {
				color: #fd0b0b;
			}
		}
		.changeType {
			.typeBox {
				padding: 30upx;
				background: #fff;
				&.selected {
					background: rgba(255, 248, 244, 1);
				}
				.jigouS {
					padding-top: 40upx;
					font-size: 24upx;
					color: #fd580a;
					align-items: center;
					image {
						width: 24upx;
						margin-right: 28upx;
						height: 24upx;
					}
				}
				.typeList {
					justify-content: flex-start;
					align-items: flex-start;

					> image {
						width: 32upx;
						height: 32upx;
						margin-right: 20upx;
						margin-top: 6upx;
					}
					.infoBox {
						width: 630upx;
						.titles {
							font-size: 30upx;
							color: #22222a;
							.btn {
								width: 148upx;
								height: 50upx;
								border: 1upx solid rgba(253, 88, 10, 1);
								border-radius: 8upx;
								text-align: center;
								line-height: 50upx;
								font-size: 28upx;
								color: rgba(253, 88, 10, 1);
							}
						}
						.desc {
							font-size: 26upx;
							color: #666666;
							padding-top: 24upx;
							> text {
								color: #fd580a;
							}
						}
					}
				}
			}
		}
	}
}

.uni-dialog-content-text {
	font-size: 29upx;
	color: #22222a;
}

.uni-dialog-button-group {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	border-top-color: #f5f5f5;
	border-top-style: solid;
	border-top-width: 1px;
}

.uni-dialog-button {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */

	flex: 1;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	height: 45px;
}

.uni-border-left {
	border-left-color: #f0f0f0;
	border-left-style: solid;
	border-left-width: 1px;
}

.uni-dialog-button-text {
	font-size: 32upx;
}

.uni-button-color {
	color: #fe590b;
}

.uni-button-cancel {
	color: #9a9a9a;
}

.uni-dialog-input {
	flex: 1;
	font-size: 14px;
}

.uni-popup__success {
	color: $uni-color-success;
}

.uni-popup__warn {
	color: $uni-color-warning;
}

.uni-popup__error {
	color: $uni-color-error;
}

.uni-popup__info {
	color: #22222a;
}
</style>
